import '../../OrderView/model/order_view_model.dart';
import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';
import '../action.dart';
import 'dart:io';
import '../../../app_files.dart';

const double kImageWidth = 90;
const double kTextFieldHeight = 70;

class PatrolConfigWidget extends StatelessWidget {
  final OrderConfigModel model;
  final Dispatch dispatch;

  const PatrolConfigWidget(this.model, this.dispatch);

  Widget _selectWidget(ConfigValue value) {
    bool isSelect = model.values.contains(value);
    return InkWell(
      child: Container(
        color: Colors.white,
        padding: EdgeInsets.only(top: 8, bottom: 8),
        child: Row(
          children: [
            Expanded(
              child: Container(
                padding: EdgeInsets.only(right: 12),
                child: Text(
                  value.name,
                  style: TextThemeConfig.Font14WithColor22,
                ),
              ),
            ),
            Image.asset(
                isSelect ? 'images/icon_select.png' : 'images/icon_normal.png'),
          ],
        ),
      ),
      onTap: () =>
          dispatch(PatrolOrderViewActionCreator.onSetConfigData(model, value)),
    );
  }

  Widget _itemWidget(ConfigValue value) {
    bool isSelect = model.values.contains(value);
    return InkWell(
      child: Container(
        padding: EdgeInsets.symmetric(horizontal: 12, vertical: 4),
        child: Text(
          value.name,
          style: !isSelect
              ? TextThemeConfig.Font13WithColor66
              : TextThemeConfig.Font13WithColorblue,
        ),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(2)),
          color: isSelect ? Color(0xffE6EEFF) : Color(0xffF5F5F5),
        ),
      ),
      onTap: () =>
          dispatch(PatrolOrderViewActionCreator.onSetConfigData(model, value)),
    );
  }

  Widget _normalWidget() => InkWell(
    child: Container(
      padding: EdgeInsets.symmetric(horizontal: 12, vertical: 4),
      child: Text(
        '正常',
        style: (model.isNormal == null || !model.isNormal)
            ? TextThemeConfig.Font13WithColor66
            : TextThemeConfig.Font13WithColorblue,
      ),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(2)),
        color: (model.isNormal == null || !model.isNormal)
            ? Color(0xffF5F5F5)
            : Color(0xffE6EEFF),
      ),
    ),
    onTap: () => dispatch(PatrolOrderViewActionCreator.onSetNormalData(model)),
  );

  Widget _otherWidget() => InkWell(
    child: Container(
      padding: EdgeInsets.symmetric(horizontal: 12, vertical: 4),
      child: Text(
        '其他问题',
        style: !model.hasOther
            ? TextThemeConfig.Font13WithColor66
            : TextThemeConfig.Font13WithColorblue,
      ),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(2)),
        color: !model.hasOther ? Color(0xffF5F5F5) : Color(0xffE6EEFF),
      ),
    ),
    onTap: () => dispatch(PatrolOrderViewActionCreator.onTapOther(model)),
  );

  Widget _imageWidget() => Container(
    margin: EdgeInsets.only(top: 20),
    height: kImageWidth,
    child: ListView.builder(
      itemBuilder: (BuildContext context, int index) {
        if (index == model.imageList.length) {
          return InkWell(
            child: Container(
              margin: EdgeInsets.only(right: 12),
              width: kImageWidth,
              height: kImageWidth,
              color: Color(0xffF5F5F5),
              child: Align(
                child: Image.asset('images/icon_camera.png'),
              ),
            ),
            onTap: () =>
                dispatch(PatrolOrderViewActionCreator.onTapAddPic(model)),
          );
        } else {
          var file = model.imageList[index];
          return InkWell(
            child: Container(
              margin: EdgeInsets.only(right: 12),
              width: kImageWidth,
              height: kImageWidth,
              child: file is File
                  ? Image(
                image: FileImageEx(file),
                width: kImageWidth,
                height: kImageWidth,
                fit: BoxFit.fill,
              )
                  : CustomImage(
                file,
                fit: BoxFit.fill,
                width: kImageWidth,
                height: kImageWidth,
              ),
            ),
            onTap: () =>
                dispatch(PatrolOrderViewActionCreator.onTapPic(model, file)),
          );
        }
      },
      itemCount: model.imageList.length + 1,
      scrollDirection: Axis.horizontal,
      itemExtent: kImageWidth + 12,
      padding: EdgeInsets.only(),
    ),
  );

  Widget _editWidget() => Container(
    margin: EdgeInsets.only(top: 12),
    height: kTextFieldHeight,
    child: TextField(
      minLines: 1,
      maxLines: 10,
      controller: model.textEditingController,
      style: TextThemeConfig.Font13WithColor22,
      decoration: InputDecoration(
        border: InputBorder.none,
        hintText: "请在此处描述问题...",
        hintStyle: TextThemeConfig.Font13WithColor99,
        contentPadding: EdgeInsets.only(),
      ),
      onChanged: (String str) {
        if (str.length > ThemeConfig.descTextLength)
          model.textEditingController.text =
              str.substring(0, ThemeConfig.descTextLength);
      },
    ),
  );

  @override
  Widget build(BuildContext context) {
    Widget _contentWidget() {
      if (model.isRemind) {
        List<Widget> items =
        model.configs.map((e) => _selectWidget(e)).toList();
        return Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: items,
        );
      } else {
        bool hasImg =
            (model.values.length != 0 && !model.isNoneNormal) || model.hasOther;
        List<Widget> items = model.configs.map((e) => _itemWidget(e)).toList();
        items.insert(0, _normalWidget());
        items.add(_otherWidget());
        return Padding(
          padding: EdgeInsets.only(top: 12, bottom: 8),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Wrap(
                spacing: 20.0, // 主轴(水平)方向间距
                runSpacing: 15.0, // 纵轴（垂直）方向间距
                alignment: WrapAlignment.start,
                children: items,
              ),
              model.hasOther ? _editWidget() : Container(),
              hasImg ? _imageWidget() : Container(),
            ],
          ),
        );
      }
    }

    return Container(
      padding: EdgeInsets.only(left: 15, right: 15, bottom: 8),
      decoration: BoxDecoration(
        color: Colors.white,
        border: Border(
            bottom: BorderSide(color: ThemeConfig.separeColor, width: 10)),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                model.configName,
                style: TextThemeConfig.Font16WithColorBold22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
            decoration: BoxDecoration(
                border:
                Border(bottom: BorderSide(color: ThemeConfig.separeColor))),
          ),
          _contentWidget(),
        ],
      ),
    );
  }
}
